import React, { useEffect, useState } from 'react';
import StockGoodsInfo from './StockGoodsInfo';
import MallGoodsInfo from './MallGoodsInfo';
import { PageContainer } from '@ant-design/pro-layout';
import { getShopGoodsDetail } from '@/services/shop/api';
import { showMsg } from '@/utils/utils';
import { history } from 'umi';
import './style.less';
import BreadcrumbDept from '@/components/BreadcrumbDept';
interface GoodsDetailProps {
  location?: any;
  type?: string;
}
const GoodsDetail: React.FC<GoodsDetailProps> = (props) => {
  const { location } = props;
  const { query } = location;
  const { shop_goods_id } = query;
  const [goodsInfo, setGoodsInfo] = useState<SHOPAPI.ShopGoods>({} as SHOPAPI.ShopGoods);

  useEffect(() => {
    if (!shop_goods_id) {
      // @ts-ignore
      const info = JSON.parse(localStorage.getItem('shop-goods-info'));
      setGoodsInfo(info);
    } else {
      getShopGoodsDetail(shop_goods_id).then((data: SHOPAPI.ShopGoods) => {
        setGoodsInfo(data);
      }).catch(error => {
        showMsg(error?.data?.errmsg);
      });
    }
  }, [shop_goods_id]);

  return <PageContainer title="编辑商品信息" extra={[
    <BreadcrumbDept />
   ]} breadcrumb={{}} onBack={() => history.goBack()}>
    <StockGoodsInfo goodsInfo={goodsInfo} />
    <MallGoodsInfo goodsInfo={goodsInfo}  />
</PageContainer>
}
export default GoodsDetail;
